回流当DOM变化影响了元素，比如元素的尺寸、布局、显示隐藏等改变了，需要重写构建。
每个页面至少需要一次回流，就是在页面第一次加载的时候，这个时候一定会发生回流。

重绘当一个元素的外观发生变化，但是没有改变布局，重新渲染元素的外观。比如background-color、color

如何避免回流与重绘？
1. 避免使用table布局：table布局在渲染时需要先计算整个表格的结构，如果表格内容发生变化，会引起整个表格的回流和重绘。
可以考虑使用CSS布局（如flexbox、grid）替代table布局。

2. 尽可能在DOM树的最末端改变class：当修改元素的class时，浏览器会重新计算元素的样式，并进行回流和重绘。
将修改class的操作放在DOM树的最末端，可以最小化回流和重绘的范围。

3. 不要频繁地操作元素的样式：频繁地修改元素的样式会导致多次回流和重绘。
可以将需要修改的样式属性合并为一个操作，或者使用CSS动画和过渡来实现平滑的样式变化。

4. 避免设置多层内联样式：多层内联样式会增加样式计算的复杂度，导致回流和重绘的次数增加。
最好将样式集中在外部样式表中，减少内联样式的使用。

5. 开启GPU加速：使用CSS3的transform和opacity属性可以触发GPU加速，加速页面的渲染过程。
但需要注意，滥用GPU加速也可能导致性能问题，应根据具体情况进行使用。

6. 使用absolute或者fixed，脱离标准文档流：将元素的定位方式设置为absolute或fixed，
可以将元素从标准文档流中脱离出来，避免其他元素的回流和重绘。
